<template>
  <view>
    <nav-bar title="消息通知"></nav-bar>
    <you-scroll
      :loadingHeight="loadingHeight"
      :mainHeight="scrollHeight"
      :isAllData="isAllData"
      :isRequestSuccess="isRequestSuccess"
      outPaddingTop="30rpx"
      @onRefresh="onRefresh"
      @loadMore="loadMore"
    >
      <template>
        <view v-if="isLoading" class="common-loading">
          <image class="loading-img" :src="baseIconUrl + '/commonIcon/icon_loading.png'" />
          正在加载数据，请稍后......
        </view>
        <view class="common-no-data" v-else-if="!messageList || messageList.length === 0">
          <image class="no-data-img" :src="baseIconUrl + '/commonIcon/icon_no_data.png'" />
          <view class="text">暂无数据</view>
        </view>
        <view v-else>
          <message-list :messageList="messageList"></message-list>
        </view>
      </template>
    </you-scroll>
  </view>
</template>

<script>
  import MessageList from '../../components/messageList.vue'
  import { baseIconUrl } from '@/config'
  import api_physician from '@/api/physician'
  export default {
    name: 'MessagePage',
    components: { MessageList },
    data() {
      return {
        baseIconUrl,
        loadingHeight: '',
        scrollHeight: '',
        isAllData: false,
        isRequestSuccess: false,
        isLoading: false,
        pageNum: 1,
        pageSize: 10,
        total: 0,
        messageList: []
      }
    },
    onLoad() {
      this.scrollHeight = this.$store.getters.heightData.noTabMainHeight + 'px'
      this.loadingHeight = this.$store.getters.heightData.noTabMainHeight - 20 + 'px'
      this.pageNum = 1
      this.messageList = []
      this.isLoading = true
      this.getMessageList()
    },
    methods: {
      getMessageList() {
        api_physician.fetchMessageList().then(res => {
          this.isLoading = false
          if (res.code !== 200) return
          this.messageList.push(...res.rows)
          this.isRequestSuccess = true
          this.total = res.total
        }).catch(err => {
          this.isLoading = false
        })
        // this.messageList = [
        //   {
        //     noticeType: '订单通知',
        //     noticeTime: '2024-03-25',
        //     title: '您有一个新的患者正在等待中，请及时联系',
        //     content: '您有一个新的患者正在等待中，请及时联系。您有一个新的患者正在等待中，请及时联系。您有一个新的患者正在等待中，请及时联系。您有一个新的患者正在等待中，请及时联系。'
        //   },
        //   {
        //     noticeType: '订单通知',
        //     noticeTime: '2024-03-25',
        //     title: '您有一个新的训练计划已到期，请点击查看',
        //     content: '您有一个新的患者正在等待中，请及时联系。您有一个新的患者正在等待中，请及时联系。'
        //   }
        // ]
        // this.isRequestSuccess = true
        // this.total = 2
      },
      // 下拉刷新
      onRefresh() {
        this.pageNum = 1
        this.messageList = []
        this.isAllData = false
        this.isRequestSuccess = false
        this.getMessageList()
      },
      // 上拉加载
      loadMore() {
        if (this.messageList.length < this.total) {
          this.pageNum++
          this.isAllData = false
          this.isRequestSuccess = false
          this.getMessageList()
        } else {
          this.isAllData = true
        }
      }
    }
  }
</script>
<style lang="scss">
</style>
